﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>Celestial Home - Extracting every detail of your dream</title>
        <link rel="Stylesheet" type="text/css" href="css/master.css" />
        <link rel="Stylesheet" type="text/css" href="css/forms.css" />
        <link rel="Stylesheet" type="text/css" href="css/login.css" />

        <script type="text/javascript" src="javascripts/helpers.js"></script>
        <script type="text/javascript" src="javascripts/login.js"></script>
        <script type="text/javascript" src="javascripts/shoppingcart.js"></script>
        <script type="text/javascript">
            window.onload = function() {
                if (checkLogin()) {
                    getSuggestions();
                }
                else {
                    hideDiv(document.getElementById('divSuggestions'));
                }
            }
        </script>
    </head>
    <body>

        <div id="divTitle">
            <div id="divCustMenu">
                <img src="images/user.png" alt="user" /><a id="aLogin" href="login.html">Login</a> |
                <img src="images/profile.png" alt="profile" /><a id="aProfile" href="particulars.html">My Profile</a> |
                <img src="images/cart.png" alt="cart" /><a href="construct.html">My Cart</a> |
                <img src="images/checkout.png" alt="checkout" /><a href="construct.html">Checkout</a>
            </div><!--ends divCustmenu-->
            <div id="divWelcome">Welcome</div>
        </div><!--ends divTitle-->

        <!-- Navigation Bar - common for all pages -->
        <div id="divNavBar">
            <ul id="ulNavBar">
                <li><img src="images/home.png" alt="home"/><a href="index.html"> Home</a></li>

                <li><img src="images/briefcase.png" alt="home"/><a href="about.html"> About Us</a></li>

                <li><img src="images/chair.png" alt="home"/><a href="construct.html"> Products</a>
                    <ul>
                        <li><a href="construct.html">Bed Room</a>
                            <ul>
                                <li><a href="construct.html">Beds</a></li>
                                <li><a href="construct.html">Cupboards</a></li>
                            </ul>
                        </li>
                        <li><a href="construct.html">Dining Room</a>
                            <ul>
                                <li><a href="construct.html">Chairs</a></li>
                                <li><a href="construct.html">Dining Tables</a></li>
                                <li><a href="construct.html">Dining Table Sets</a></li>
                            </ul>
                        </li>

                        <li><a href="construct.html">Living Room</a>
                            <ul>
                                <li><a href="construct.html">Coffee Tables</a></li>
                                <li><a href="construct.html">Sofa</a></li>
                                <li><a href="construct.html">Sofa Sets</a></li>
                                <li><a href="construct.html">TV Cabinets</a></li>
                            </ul>
                        </li>
                        <li><a href="construct.html">Study Room</a>
                            <ul>
                                <li><a href="construct.html">Desks</a></li>
                                <li><a href="construct.html">Book Shelves</a></li>
                            </ul>
                        </li>
                    </ul>
                </li> <!--ends Products menu-->

                <li><img src="images/design.png" alt="home"/><a href="construct.html"> Design</a>
                    <ul>
                        <li><a href="construct.html">Cupboard</a></li>
                        <li><a href="construct.html">Home Theatre</a></li>
                    </ul>
                </li> <!--ends design menu-->
                <li><img src="images/earth.png" alt="home"/><a href="construct.html"> Support</a>
                    <ul>
                        <li ><a href="contact.html">Contact Us</a></li>
                        <li><a href="construct.html">Track Your Order</a></li>
                        <li><a href="construct.html">Your Account</a></li>
                    </ul>
                </li> <!--ends support menu-->

                <li id="lstManager"><img src="images/manager_tasks.png" alt="manager tasks" /><a href="customers.html"> Manager Tasks</a></li>

            </ul>  <!--ends navigation menu-->
        </div> <!--ends navigation division-->

        <div id="divMain" align="center">

            <p align="left">&gt;<u>Edit Cart</u></p>
            <fieldset style="width:650px;text-align:center;" >
                <form id="form1" name="form1" method="post" action="#">
                    <p>
                        <script language="javascript" type="text/javascript">

                            <!--

                            document.cookie = 'products=productid1:name1:1:1/productid2:name2:2:2/productid3:name3:3:3';
                            var cookie = getCookie('products');
                            var products = cookie.split('/');
                            if (products == "") {
                                document.writeln("There are no items in your shopping cart!");
                            }
                            else {
                                document.writeln('<table align="center" width="auto" border="0" cellspacing="0" cellpadding="0"><tr class="trHeader"><td width="60"></td><td>Product</td><td>Qty</td><td>Unit Price </td><td>Extended Price </td><td></td></tr>');
                                for (var i = 0; i < products.length; i ++) {
                                    var productdata = products[i].split(':');
                                    document.writeln('<tr id="' + i + '">');
                                    document.writeln('<td><a href="javascript:deleteProduct(\'' + productdata[0] +'\', ' + i + ')">Delete</a></td>');
                                    document.writeln('<td height="23">' + productdata[1] + '</td>');
                                    document.writeln('<td><input type="text" id="'+ i +'qty" size="5" value="' + productdata[2] + '"></td>');
                                    document.writeln('<td>$' + productdata[3] + '</td>');
                                    document.writeln('<td id="extended' + i + '">$' + productdata[3] * productdata[2] + '</td>');
                                    document.writeln('<td><a href="javascript:updateProduct(\'' + productdata[0] +'\', ' + i + ')">Update</a></td>');
                                    document.writeln('</tr>');
                                }
                                document.writeln('<tr>');
                                document.writeln('<td height="23" colspan="4">Total Price</td>');
                                var totalprice = calculateTotalPrice(products);
                                document.writeln('<td id="totalprice">$' + totalprice + '</td><td></td>');
                                document.writeln('</tr>');
                                document.writeln('<tr><td colspan = "4"><div id="divError"></div></td><td colspan = "2" align="Right">');
                                document.writeln('<a href="javascript: checkout()">Checkout</a></td></td></tr></table>');
                            }

                            //-->
                        </script>
                    </p>
                </form>
                <div id="divSuggestions">
                    <p>Suggested Products</p>
                    <table align="center" width="200" border="1">
                        <tr>
                            <td><table id="tableSuggestions" width="324" border="1">
                                    <!-- below is just nonsense data -->
                                    <tr>
                                        <td width="97">Product XYZ </td>
                                        <td width="121" rowspan="2"><img src="image.jpg" width="118" height="88" /></td>
                                        <td width="92" rowspan="2"><a href="javascript:addToCart()">Add To Cart </a></td>
                                    </tr>
                                    <tr>
                                        <td><div align="right">&gt;&gt;<a href="products.html">Specs</a></div></td>
                                    </tr>
                                    <!-- end nonsense data-->
                                </table></td>
                        </tr>
                    </table>
                </div>
            </fieldset>
        </div> <!-- ends divMain -->

        <div id="divFooter">
            <div id="divFooterLeft">&#169 Copyright 2010 Celestial Home</div>
            <div id="divFooterRight"> Site Design by <a href="#" id="aDreamArchitect"><img src="images/dream.png" alt="Dream Architect"/></a></div>
            <div id="divFooterCenter"><img src="images/visa.gif" alt=""/><img src="images/paypal.png" alt="" /></div>
        </div><!--ends divFooter-->

    </body>
</html>
